{extend name="layout/default" /}
{block name="head"}
<title>数据表列表</title>

{/block}
{block name="content"}
<div class="ok-body">
    <!--模糊搜索区域-->

    <!--数据表格-->
    <table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
</div>
{/block}
{block name="scripts"}
<!--js逻辑-->
<script>
    layui.use(["element", "jquery", "table", "form", "laydate", "okLayer", "okUtils", "okMock"], function () {
        let table = layui.table;
        let form = layui.form;
        let laydate = layui.laydate;
        let okLayer = layui.okLayer;
        let okUtils = layui.okUtils;
        let okMock = layui.okMock;
        let $ = layui.jquery;

        okLoading.close($);

        laydate.render({ elem: "#startTime", type: "datetime" });
        laydate.render({ elem: "#endTime", type: "datetime" });

        let userTable = table.render({
            elem: '#tableId',
            url: '{:url("index")}',
            limit: 20,
            page: false,
            toolbar: true,
            toolbar: "#toolbarTpl",
            height: 'full',
            cellMinWidth: 120,
            cols: [[
                { type: "checkbox", fixed: "left" },
                { field: "id", title: "ID", sort: true },
                { field: "name", title: "表名" },
                { field: "comment", title: "描述" },
                { title: "操作", align: "center", fixed: "right", templet: "#operationTpl" }
            ]],
            done: function (res, curr, count) {
                console.info(res, curr, count);
            }
        });

        form.on("submit(search)", function (data) {
            userTable.reload({
                where: data.field,
                page: { curr: 1 }
            });
            return false;
        });

        table.on("toolbar(tableFilter)", function (obj) {
            switch (obj.event) {
                case "batchEnabled":
                    batchEnabled();
                    break;
                case "batchDisabled":
                    batchDisabled();
                    break;
                case "batchDel":
                    batchDel();
                    break;
                case "add":
                    add();
                    break;
            }
        });

        table.on("tool(tableFilter)", function (obj) {
            let data = obj.data;
            switch (obj.event) {
                case "crud":
                    crud(data.name);
                    break;
                case 'plugin':
                    plugin(data.name);
                    break;
            }
        });

        function batchEnabled() {
            okLayer.confirm("确定要批量启用吗？", function (index) {
                layer.close(index);
                let idsStr = okUtils.tableBatchCheck(table);
                if (idsStr) {
                    okUtils.ajax("{:url('setNormal')}", "put", { idsStr: idsStr }, true).done(function (response) {
                        if (response.code == 1) {
                            console.log(response);
                            okUtils.tableSuccessMsg(response.msg);
                        } else {
                            okLayer.greenTickMsg(response.msg, function () {

                            })
                        }
                    }).fail(function (error) {
                        console.log(error)
                    });
                }
            });
        }

        function batchDisabled() {
            okLayer.confirm("确定要批量停用吗？", function (index) {
                layer.close(index);
                let idsStr = okUtils.tableBatchCheck(table);
                if (idsStr) {
                    okUtils.ajax("{:url('setStop')}", "put", { idsStr: idsStr }, true).done(function (response) {

                        if (response.code == 1) {
                            console.log(response);
                            okUtils.tableSuccessMsg(response.msg);
                        } else {
                            okLayer.greenTickMsg(response.msg, function () {

                            })
                        }
                    }).fail(function (error) {
                        console.log(error)
                    });
                }
            });
        }

        function batchDel() {
            okLayer.confirm("确定要批量删除吗？", function (index) {
                layer.close(index);
                let idsStr = okUtils.tableBatchCheck(table);
                if (idsStr) {
                    okUtils.ajax("{:url('delete')}", "delete", { idsStr: idsStr }, true).done(function (response) {
                        //console.log(response);
                        //okUtils.tableSuccessMsg(response.msg);
                        if (response.code == 1) {
                            console.log(response);
                            okUtils.tableSuccessMsg(response.msg);
                        } else {
                            okLayer.greenTickMsg(response.msg, function () {

                            })
                        }
                    }).fail(function (error) {
                        console.log(error)
                    });
                }
            });
        }

        function add() {
            okLayer.open("添加", "{:url('add')}", "90%", "90%", null, function () {
                userTable.reload();
            })
        }

        function edit(data) {
            okLayer.open("更新", "edit?id=" + data.id, "90%", "90%", function (layero) {
                //let iframeWin = window[layero.find("iframe")[0]["name"]];
                //iframeWin.initForm(data);
            }, function () {
                userTable.reload();
            })
        }

        function del(id) {
            okLayer.confirm("确定要删除吗？", function () {
                okUtils.ajax("{:url('delete')}", "delete", { idsStr: id }, true).done(function (response) {


                    if (response.code == 1) {
                        console.log(response);
                        okUtils.tableSuccessMsg(response.msg);
                    } else {
                        okLayer.greenTickMsg(response.msg, function () {

                        })
                    }

                }).fail(function (error) {
                    console.log(error)
                });
            })
        }

        function crud(res) {
            okLayer.confirm("确定要crud吗？", function () {
                okUtils.ajax("{:url('crud')}", "post", { name: res }, true).done(function (res) {
                    if (res.code === 1) {
                        okUtils.tableSuccessMsg(res.msg);
                    } else {
                        okUtils.tableSuccessMsg(res.msg);
                    }
                }).fail(function () {

                });
            })
        }

        function plugin(res) {
            okLayer.confirm("确定要插件crud吗？", function () {
                okUtils.ajax("{:url('plugin')}", "post", { name: res }, true).done(function (res) {
                    if (res.code === 1) {
                        okUtils.tableSuccessMsg(res.msg);
                    } else {
                        okUtils.tableSuccessMsg(res.msg);
                    }
                }).fail(function () {

                });
            })
        }
    })
</script>
<!-- 头工具栏模板 -->
<script type="text/html" id="toolbarTpl">
    <div class="layui-btn-container">

    </div>
</script>
<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
    <a href="javascript:" lay-event="crud" class="layui-btn layui-btn-warm layui-btn-xs">一键crud</a>
    <a href="javascript:" lay-event="plugin" class="layui-btn layui-btn-sm layui-btn-xs">一键插件</a>
</script>

<script type="text/html" id="statusTpl">
    {{#  if(d.status == 'normal'){ }}
    <span class="layui-btn layui-btn-normal layui-btn-xs">启用</span>
    {{#  } else if(d.status != 'normal') { }}
    <span class="layui-btn layui-btn-warm layui-btn-xs">停用</span>
    {{#  } }}
</script>

<script type="text/html" id="logoTpl">
    <img src="{{d.avatar}}" style="width: auto;height: 100%;"/>
</script>
<script type="application/javascript">

</script>

{/block}